<!DOCTYPE html>
<html lang="zh-CN">
<head>
    <meta charset="UTF-8">
    <title>陪诊员注册</title>
    <link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0/dist/css/bootstrap.min.css" rel="stylesheet">
</head>
<body>
<div class="container mt-5">
    <div class="row justify-content-center">
        <div class="col-md-6">
            <h2 class="text-center">陪诊员注册</h2>
            <form id="escortRegisterForm">
                <div class="mb-3">
                    <label for="realName" class="form-label">真实姓名</label>
                    <input type="text" class="form-control" id="realName" required>
                </div>

                <div class="mb-3">
                    <label for="gender" class="form-label">性别</label>
                    <select class="form-select" id="gender" required>
                        <option value="">请选择性别</option>
                        <option value="male">男</option>
                        <option value="female">女</option>
                    </select>
                </div>

                <div class="mb-3">
                    <label for="idCard" class="form-label">身份证号码</label>
                    <input type="text" class="form-control" id="idCard" pattern="\d{17}[\dXx]" required>
                </div>

                <div class="mb-3">
                    <label for="phone" class="form-label">联系电话</label>
                    <input type="tel" class="form-control" id="phone" pattern="1[3-9]\d{9}" required>
                </div>

                <div class="mb-3">
                    <label for="password" class="form-label">登录密码</label>
                    <input type="password" class="form-control" id="password" minlength="6" required>
                </div>

                <div class="mb-3">
                    <label for="confirmPassword" class="form-label">确认密码</label>
                    <input type="password" class="form-control" id="confirmPassword" minlength="6" required>
                </div>

                <div class="mb-3">
                    <label for="profile" class="form-label">个人简介</label>
                    <textarea class="form-control" id="profile" rows="3"></textarea>
                </div>

                <button type="submit" class="btn btn-primary w-100">立即注册</button>
            </form>

            <div class="mt-3 text-center">
                <a href="/escort/login.html">已有账号？去登录</a>
            </div>
        </div>
    </div>
</div>

<script>
    document.getElementById('escortRegisterForm').addEventListener('submit', function(e) {
        e.preventDefault();

        const password = document.getElementById('password').value;
        const confirmPassword = document.getElementById('confirmPassword').value;

        if (password !== confirmPassword) {
            alert('两次输入的密码不一致');
            return;
        }

        const escortData = {
            realName: document.getElementById('realName').value,
            gender: document.getElementById('gender').value,
            idCard: document.getElementById('idCard').value,
            phone: document.getElementById('phone').value,
            password: password,
            profile: document.getElementById('profile').value
        };

        fetch('http://localhost:8080/api/escort/register', {
            method: 'POST',
            headers: {
                'Content-Type': 'application/json'
            },
            body: JSON.stringify(escortData)
        })
            .then(response => response.json())
            .then(data => {
                if (data.state === 2000) { // 成功
                    alert('注册成功，请等待审核');
                    window.location.href = '/escort/login.html';
                } else {
                    alert('注册失败：' + data.message);
                }
            })
            .catch(error => {
                console.error('Error:', error);
                alert('注册请求出错，请检查网络连接');
            });
    });
</script>
</body>
</html>
